<template>
  <div class="leave-office">
    <el-dialog
      v-el-drag-dialog="{ drag: true, full: false, resize: false }"
      :visible="true"
      :close-on-click-modal="false"
      @close="closeMd"
      title="离职处理"
      width="400px">
      <el-form 
        :model="fm.ps"
        :ref="fm.fname"
        :label-width="'100px'">
        <el-form-item
          label="离职信息:"
          prop="leaveInfo"
          :rules="[{ required: true,  message: '请输入员工离职信息', trigger: 'change' }]">
          <el-input 
            maxlength="200"
            :autosize="{ minRows: 2, maxRows: 6 }"
            type="textarea"
            clearable
            show-word-limit 
            v-model="fm.ps.leaveInfo" 
            placeholder="请输入员工离职信息" 
          />
        </el-form-item>
      </el-form>

      <div slot="footer" class="dialog-footer">
        <el-button 
          type="primary" 
          :icon="'el-icon-circle-check'" 
          @click="onSubmit" 
          :loading="fm.sb.load">
          确定
        </el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import elDragDialog from "@/directive/el-drag-dialog";
import * as personManSer from "@/api/services/personMan.service";

export default {
  name: 'LeaverOffice',
  directives: {elDragDialog},
  props: ['id'],
  data() {
    return {
      fm: {
        fname: 'leaverOfficeFm',
        sb: { load: false },
        ps: {
          // 员工id
          id: this.id,
          // 离职原因
          leaveInfo: '',
        }
      }
    };
  },
  methods: {
    closeMd() {
      this.$emit("myClick", {state: false});
    },
    onSubmit() {
      let that = this, U = that.U, fm = that.fm, sb = fm.sb, ps = U.scopy(fm.ps);
      console.log('提交前参数', ps);

      that.$refs[fm.fname].validate(valid => {
        if (!valid) { return false; } else {
          personManSer.leaveStaff(ps).then(res => {
            if(res.code != 1){
              U.qerror(res.msg);
            }else {
              U.qsuccess(res.msg);

              that.closeMd();
              that.$emit("reloadDg");
            }
          });
        }
      })
    }
  },
};
</script>
<style lang="less" scoped>
.leave-office{
  ::v-deep .el-textarea textarea{
    height: 150px !important;
  }
}
</style>